<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>临沂市消防监控系统</title>
    <link rel="stylesheet" type="text/css" href="../lib/css/elementui.css"/>
    <link rel="stylesheet" type="text/css" href="../css/common.css"/>
    <link rel="stylesheet" href="../lib/css/bootstrop.css" />
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../css/Smallservice.css">
    <script src="../lib/js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../lib/js/uilt.config.js"></script>
    <script src="../../lib/js/uitl.js"></script>
    <script src="../lib/js/jquery.cookie.js"></script>
    <link rel="stylesheet" href="../css/mues_side.css">
    <script src="../lib/layui/layui.all.js"></script>
    <script src="../lib/js/bootstrap.min.js"></script>


</head>

<body>
<div id="cele">
    <el-container>
        <el-header >
            <el-row :gutter="20">
                <el-col :span="5">
                    <div class="header-bj header-left">
                        {{time}}
                    </div>
                </el-col>
                <el-col :span="14">
                    <div class="header-center">
                        <h3>消防联动预警平台</h3>
                    </div>
                </el-col>
                <el-col :span="5">
                    <div class="header-right">
                        <div class="header-bj  header-text">
                            <!-- <p>{{FireManInfoModel.Fire_brigade_name}}</p>-->
                        </div>
                        <div class="header-bj  header-btn" @click="Quit">退出</div>
                    </div>
                </el-col>
            </el-row>
        </el-header>
        <el-container>
            <el-aside width="220px"  style="margin-top: 10px;margin-left: 20px;">
                <el-row class="tac">
                    <el-col :span="24">
                        <div class="container-fluid">
                            <div class="row">
                                <div class=" main-left-bj background">
                                    <ul id="main-nav" class="nav nav-stacked" style="">
                                        <li>
                                            <a href="fire_main.html" class="nav-header collapsed">
                                                首页
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#jy" class="nav-header collapsed active" data-toggle="collapse">
                                                救援行动
                                                <span class="pull-right glyphicon glyphicon-plus red-text"></span>
                                            </a>
                                            <ul id="jy" class="nav nav-list collapse secondmenu text-center" style="height: 0px;">
                                                <li><a href="#">历史行动</a></li>
                                                <li><a href="#">出警信息</a></li>
                                                <li><a href="#">应急预案</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="#systemSetting" class="nav-header collapsed" data-toggle="collapse">
                                                消防员
                                                <span class="pull-right glyphicon glyphicon-plus red-text"></span>
                                            </a>
                                            <ul id="systemSetting" class="nav nav-list collapse secondmenu text-center" style="height: 0px;">
                                                <li><a href="control_People.html">人员排版</a></li>
                                                <li><a href="#">人员信息维护</a></li>
                                                <li><a href="#">行动统计</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="#wz" class="nav-header collapsed" data-toggle="collapse">
                                                微站管理
                                                <span class="pull-right glyphicon glyphicon-plus red-text"></span>
                                            </a>
                                            <ul id="wz" class="nav nav-list collapse secondmenu text-center" style="height: 0px;">
                                                <li><a href="#">历史行动</a></li>
                                                <li><a href="#">出警信息</a></li>
                                                <li><a href="#">应急预案</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="#tz" class="nav-header collapsed" data-toggle="collapse">
                                                通知管理
                                                <span class="pull-right glyphicon glyphicon-plus red-text"></span>
                                            </a>
                                            <ul id="tz" class="nav nav-list collapse secondmenu text-center" style="height: 0px;">
                                                <li><a href="#">人员排版</a></li>
                                                <li><a href="#">人员信息维护</a></li>
                                                <li><a href="#">行动统计</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="#xf" class="nav-header collapsed active" data-toggle="collapse">
                                                消防知识
                                                <span class="pull-right glyphicon glyphicon-plus red-text"></span>
                                            </a>
                                            <ul id="xf" class="nav nav-list collapse secondmenu text-center" style="height: 0px;">
                                                <li><a href="#">历史行动</a></li>
                                                <li><a href="#">出警信息</a></li>
                                                <li><a href="#">应急预案</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="#xt" class="nav-header collapsed active" data-toggle="collapse">
                                                系统管理
                                                <span class="pull-right glyphicon glyphicon-plus red-text"></span>
                                            </a>
                                            <ul id="xt" class="nav nav-list collapse secondmenu text-center" style="height: 0px;">
                                                <li><a href="#">历史行动</a></li>
                                                <li><a href="#">出警信息</a></li>
                                                <li><a href="#">应急预案</a></li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </el-col>
                </el-row>
            </el-aside>
            <el-main>
                <div class="main-nr">
                    <div class="main-nr-bj background">
                        <div class=" ly-bigbg">
                            <p style="padding-top: 30px;margin: 0;text-align: right;"><button class="bgcolor" @click="newValpeople()">新增</button></p>
                            <div style="padding: 20px;" id="lll">
                                <table cellpadding="0" cellspacing="0">
                                    <thead>
                                    <tr>
                                        <th>管理员姓名</th>
                                        <th>联系电话1</th>
                                        <th>联系电话2</th>
                                        <th>微站名称</th>
                                        <th>所属辖区编号</th>
                                        <th>所属辖区名称</th>
                                        <th width="250">操作</th>
                                    </tr>
                                    </thead>
                                    <tbody style="height: 100px">
                                    <tr v-for="(item,index) in adminLists">
                                        <td>
                                            <span >{{item.Station_manager_name}}</span>
                                        </td>
                                        <td>
                                            <span>{{item.Contact1}}</span>
                                        </td>
                                        <td>
                                            <span>{{item.Contact2}}</span>
                                        </td>
                                        <td>
                                            <span>{{item.Station_name}}</span>
                                        </td>
                                        <td>
                                            <span>{{item.Belong_area_number}}</span>
                                        </td>
                                        <td>
                                            <span>{{item.Belong_area_name}}</span>
                                        </td>
                                        <td  width="250">
                                            <button class="bgcolor" @click="goin(item)">查看</button>
                                            <button class="bgcolor" @click="deldata(item)">删除</button>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <!--信息-->
                <div class="bg_10" v-show="flag">
                    <el-form ref="form" :model="form" label-width="120px">
                            <el-form-item label="管理员姓名">
                                <el-input v-model="form.Station_manager_name"></el-input>
                            </el-form-item>
                            <el-form-item label="联系电话1">
                                <el-input v-model="form.Contact1"></el-input>
                            </el-form-item>
                            <el-form-item label="联系电话2">
                                <el-input v-model="form.Contact2"></el-input>
                            </el-form-item>
                            <el-form-item label="微站名称">
                                <el-input v-model="form.Station_name"></el-input>
                            </el-form-item>
                            <el-form-item label="所属辖区编号" v-show="flag1">
                                <el-input v-model="form.Belong_area_number"></el-input>
                            </el-form-item>
                            <el-form-item label="所属辖区名称" v-show="flag1">
                                <el-input v-model="form.Belong_area_name"></el-input>
                            </el-form-item>
                            <el-form-item label="" v-show="flag2">
                                <el-input type="hidden"></el-input>
                            </el-form-item>
                            <el-form-item label="" v-show="flag2">
                                <el-input type="hidden"></el-input>
                            </el-form-item>
                    </el-form>
                    <p>
                        <a href="javascript:void(0);" class="ly_a"  @click="quxiao()">取消</a>
                        <a href="javascript:void(0);" class="ly_a" @click="InsertStationAndManager()">确定</a>
                        <a href="javascript:void(0);" class="ly_a" @click="updata()">更新信息</a>
                    </p>
                </div>
            </el-main>
        </el-container>
    </el-container>
</div>
</body>


<script src="../lib/js/vue.js" type="text/javascript" charset="utf-8"></script>
<script src="../lib/js/elementui.js" type="text/javascript" charset="utf-8"></script>
<script src="../lib/js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/config.js"></script>
<script src="../js/Smallservice.js"></script>

<style>
    td span{
        color: #fff;
    }
    .el-icon-arrow-down:before {
        content: "\e62B";
        font-weight: 900;
        color: red;
    }
    .el-form-item__label{
        color: #FFF;
    }
    .el-icon-minus:before{
        content:"\e621";
        font-weight: 900;
        color: yellow;
    }
    .main-table table td {
        line-height: 30px;
        color: #fff;
    }
    .el-col.el-col-11{
        width: 100% !important;
    }
    .el-input__inner{
        line-height: 28px;
        height: 30px;
        background:rgba(0,0,0,0) ;
        width: 100% !important;
    }
    .bgcolor {
        color: #fff;
        border-radius: 100px;
        font-size: 12px;
        /* padding: 2px 10px; */
        display: inline;
        width: 80px;
        height: 24px;
        line-height: 20px;
        background: red;
        border: red;
    }
    table#tbody tr:nth-child(1) span{
        background: red!important;
    }
    table#tbody tr:nth-child(2) span{
        background: #BAC100!important;
    }
    .xiaofang{
        font-weight: 900;
        font-size: 16px;
        text-align: center;
    }
    .el-form-item{
        margin-bottom: 0;
    }
    .el-select{
        width: 100%;
    }
    .inline-input{
        width: 100%;
    }
</style>
</html>